import React from 'react';

import {
    StyleSheet
} from 'react-native';

import {
    Stack,
    Scene,
    Router,
    Actions
} from 'react-native-router-flux';

import Layer from './layer';

import deepLink from './deepLink';

import routes, { Route } from './config';

import * as Event from './../utils/event';

const renderPage = (_route: Route) => {
    let _onEnterFn:Function = () => null;

    const {
        path,
        lockPage,
        component
    } = _route;

    const _Props = {
        lockPage:!!lockPage,
        onCreated: (fn: Function) => {
            _onEnterFn = fn;
        }
    }

    return (
        <Scene
            key={path}
            path={path}
            onEnter={() => _onEnterFn()}
            component={Layer(component, _Props)}
        />
    )
}

const Nodes = (
    <Stack
        hideNavBar
        children={routes.map(renderPage)}
    />
)


const RouteProps = {
    children:Nodes,
    onDeepLink:deepLink,
    uriPrefix:`hukapp://open`
}

const Routers = () => (
    <Router
        {...RouteProps}
        sceneStyle={styles.sceneStyle}
        backAndroidHandler={() => true}
    />
)

export default Routers;

const styles:any = StyleSheet.create({
    sceneStyle:{
        flex:1,
        backgroundColor: `#eff3f7`
    }
})

//退出监听
Event.add(Event.ON_USER_OUT, () => (
    Actions.reset(`/`)
))